<!DOCTYPE html>
<html>

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" charset="UTF-8">
		<title>我的-我的收藏-百台云 - 直播你的梦想（https://www.100ytv.com）</title>
		<meta name="keywords" content="百台云">
		<meta name="description" content="百台云">
		<meta name="Copyright" content="百台云 All Rights Reserved">
		<meta name="Robots" content="All">
		<meta name="application-name" content="百台云 www.luoanziben.com">
		<meta name="msapplication-tooltip" content="百台云 www.luoanziben.com">
		<meta http-equiv="X-UA-Compatible" content="IE=Edge">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
		<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
		<!--title小图标显示-->
		<link rel="icon" href="images/ico-logo.png" type="image/x-icon">
		<link rel="shortcut icon" href="images/ico-logo.png">
		<link rel="Bookmark" href="images/ico-logo.png">
		<!--样式文件-->
		<link rel="stylesheet" type="text/css" href="css/aui.css" />
		<link rel="stylesheet" type="text/css" href="css/bty.css" />
	</head>

	<body>
		<!--start:header头部-->
		<header id="bty_header" class="aui-bar aui-bar-nav">
			<a onclick="javascript:history.back(-1);" class="aui-pull-left aui-btn"> <span class="aui-iconfont aui-icon-left"></span> </a>
			<div class="aui-title">我的收藏</div>
			<div class="aui-pull-right aui-font-size-14" id="finished" onclick="allCheck();"> 编辑 </div>
		</header>
		<!--end:header头部--->

		<!--start:内容区域-->
		<ul class="aui-list aui-media-list bg-transparent">
			<li class="aui-padded-0 aui-list-item aui-margin-b-10 bg-white">
				<div class="aui-media-list-item-inner">
					<div class="aui-padded-10 aui-padded-r-0 vertical-center-1 moreChecked" >
                    	<input class="aui-radio radioList" type="checkbox" name="" > 
	                </div>
					
					<div class="aui-padded-10 vertical-center-1">
                    	<img options="size=120x120&bgcolor=#ccc&color=#ffffff&fsize=20&text=120x120" class="placeholder"/>
	                </div>
	                
					<div class="aui-list-item-inner">
						<div class="aui-list-item-text aui-margin-b-5">
							<div class="aui-list-item-title">带有媒体的列表1</div>
							<div class="aui-list-item-right">08:00</div>
						</div>
						<div class="aui-list-item-text aui-margin-b-5 aui-font-size-12">
							这里是内容区域，新版中的列表布局可以很轻松的帮助开发者完成常见列表样式。
						</div>
						<div class="aui-info nopadding">
							<div class="aui-info-item">
								<img options="size=20x20&bgcolor=#ccc&color=#ffffff&fsize=12&text=20x20" class="placeholder aui-img-round"/>
								<span class="aui-margin-l-5">￥<span>10000</span></span>
							</div>
							<div class="aui-info-item aui-btn-sm aui-btn-outlined aui-btn-danger btn-radius aui-font-size-12 aui-padded-r-10 aui-padded-l-10">取消收藏</div>
						</div>
					</div>
				</div>
			</li>
			
			<li class="aui-padded-0 aui-list-item aui-margin-b-10 bg-white">
				<div class="aui-media-list-item-inner">
					<div class="aui-padded-10 aui-padded-r-0 vertical-center-1 moreChecked" >
                    	<input class="aui-radio radioList" type="checkbox" name="" > 
	                </div>
					
					<div class="aui-padded-10 vertical-center-1">
                    	<img options="size=120x120&bgcolor=#ccc&color=#ffffff&fsize=20&text=120x120" class="placeholder"/>
	                </div>
	                
					<div class="aui-list-item-inner">
						<div class="aui-list-item-text aui-margin-b-5">
							<div class="aui-list-item-title">带有媒体的列表2</div>
							<div class="aui-list-item-right">08:00</div>
						</div>
						<div class="aui-list-item-text aui-margin-b-5 aui-font-size-12">
							这里是内容区域，新版中的列表布局可以很轻松的帮助开发者完成常见列表样式。
						</div>
						<div class="aui-info nopadding">
							<div class="aui-info-item">
								<img options="size=20x20&bgcolor=#ccc&color=#ffffff&fsize=12&text=20x20" class="placeholder aui-img-round"/>
								<span class="aui-margin-l-5">￥<span>10000</span></span>
							</div>
							<div class="aui-info-item aui-btn-sm aui-btn-outlined aui-btn-danger btn-radius aui-font-size-12 aui-padded-r-10 aui-padded-l-10">取消收藏</div>
						</div>
					</div>
				</div>
			</li>
			
			<li class="aui-padded-0 aui-list-item aui-margin-b-10 bg-white">
				<div class="aui-media-list-item-inner">
					<div class="aui-padded-10 aui-padded-r-0 vertical-center-1 moreChecked" >
                    	<input class="aui-radio radioList" type="checkbox" name="" > 
	                </div>
					
					<div class="aui-padded-10 vertical-center-1">
                    	<img options="size=120x120&bgcolor=#ccc&color=#ffffff&fsize=20&text=120x120" class="placeholder"/>
	                </div>
	                
					<div class="aui-list-item-inner">
						<div class="aui-list-item-text aui-margin-b-5">
							<div class="aui-list-item-title">带有媒体的列表3</div>
							<div class="aui-list-item-right">08:00</div>
						</div>
						<div class="aui-list-item-text aui-margin-b-5 aui-font-size-12">
							这里是内容区域，新版中的列表布局可以很轻松的帮助开发者完成常见列表样式。
						</div>
						<div class="aui-info nopadding">
							<div class="aui-info-item">
								<img options="size=20x20&bgcolor=#ccc&color=#ffffff&fsize=12&text=20x20" class="placeholder aui-img-round"/>
								<span class="aui-margin-l-5">￥<span>10000</span></span>
							</div>
							<div class="aui-info-item aui-btn-sm aui-btn-outlined aui-btn-danger btn-radius aui-font-size-12 aui-padded-r-10 aui-padded-l-10">取消收藏</div>
						</div>
					</div>
				</div>
			</li>
			
			<li class="aui-padded-0 aui-list-item aui-margin-b-10 bg-white">
				<div class="aui-media-list-item-inner">
					<div class="aui-padded-10 aui-padded-r-0 vertical-center-1 moreChecked" >
                    	<input class="aui-radio radioList" type="checkbox" name="" > 
	                </div>
					
					<div class="aui-padded-10 vertical-center-1">
                    	<img options="size=120x120&bgcolor=#ccc&color=#ffffff&fsize=20&text=120x120" class="placeholder"/>
	                </div>
	                
					<div class="aui-list-item-inner">
						<div class="aui-list-item-text aui-margin-b-5">
							<div class="aui-list-item-title">带有媒体的列表4</div>
							<div class="aui-list-item-right">08:00</div>
						</div>
						<div class="aui-list-item-text aui-margin-b-5 aui-font-size-12">
							这里是内容区域，新版中的列表布局可以很轻松的帮助开发者完成常见列表样式。
						</div>
						<div class="aui-info nopadding">
							<div class="aui-info-item">
								<img options="size=20x20&bgcolor=#ccc&color=#ffffff&fsize=12&text=20x20" class="placeholder aui-img-round"/>
								<span class="aui-margin-l-5">￥<span>10000</span></span>
							</div>
							<div class="aui-info-item aui-btn-sm aui-btn-outlined aui-btn-danger btn-radius aui-font-size-12 aui-padded-r-10 aui-padded-l-10">取消收藏</div>
						</div>
					</div>
				</div>
			</li>
			
			<li class="aui-padded-0 aui-list-item aui-margin-b-10 bg-white">
				<div class="aui-media-list-item-inner">
					<div class="aui-padded-10 aui-padded-r-0 vertical-center-1 moreChecked" >
                    	<input class="aui-radio radioList" type="checkbox" name="" > 
	                </div>
					
					<div class="aui-padded-10 vertical-center-1">
                    	<img options="size=120x120&bgcolor=#ccc&color=#ffffff&fsize=20&text=120x120" class="placeholder"/>
	                </div>
	                
					<div class="aui-list-item-inner">
						<div class="aui-list-item-text aui-margin-b-5">
							<div class="aui-list-item-title">带有媒体的列表5</div>
							<div class="aui-list-item-right">08:00</div>
						</div>
						<div class="aui-list-item-text aui-margin-b-5 aui-font-size-12">
							这里是内容区域，新版中的列表布局可以很轻松的帮助开发者完成常见列表样式。
						</div>
						<div class="aui-info nopadding">
							<div class="aui-info-item">
								<img options="size=20x20&bgcolor=#ccc&color=#ffffff&fsize=12&text=20x20" class="placeholder aui-img-round"/>
								<span class="aui-margin-l-5">￥<span>10000</span></span>
							</div>
							<div class="aui-info-item aui-btn-sm aui-btn-outlined aui-btn-danger btn-radius aui-font-size-12 aui-padded-r-10 aui-padded-l-10">取消收藏</div>
						</div>
					</div>
				</div>
			</li>
			
		</ul>
		<!--end:内容区域-->
		
		<!--start:footer-->
		<footer class="aui-bar aui-bar-tab bg-white" id="footer" style="display: none;">
			<div class="aui-col-xs-9 aui-padded-10 vertical-left-1" onclick="allcheck_btn()">
        		<input id="allCheckBtn" class="aui-radio" type="checkbox"/>
        		<span class="aui-margin-l-5">全选</span>
			</div>
			<a class="aui-col-xs-3 ">
				<div class="aui-btn aui-btn-block aui-btn-danger" onclick="openDialog('text')"><span class="font-size-12"></span>全部删除</div>
			</a>
		</footer>
		<!--end:footer-->
	</body>
	<script type="text/javascript" src="js/api.js"></script>
	<script type="text/javascript" src="js/aui-slide.js"></script>
	<script type="text/javascript" src="js/aui-tab.js"></script>
	<script type="text/javascript" src="js/aui-pull-refresh.js"></script>
	<script type="text/javascript" src="js/aui-scroll.js"></script>
	<script type="text/javascript" src="js/aui-dialog.js"></script>
	<script src="js/placeholder.min.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript" src="js/zepto.js" charset="utf-8"></script>
	<script type="text/javascript">
		//头部脚部占位div
 		$('#bty_header').after('<div style="height:'+ $('#bty_header').height()  +'px"></div>');
 		$('#footer').after('<div style="height:'+ $('#footer').height()  +'px;background:#fff;"></div>');
		
		var moreChecked_flag = true;
		function allCheck(){
			var moreChecked = document.getElementsByClassName('moreChecked');
			var finished = document.getElementById('finished');
			if(moreChecked_flag){
				for(i=0;i<moreChecked.length;i++){
					moreChecked[i].style.display='flex';
				}
				finished.innerText = '完成';
				footer.style.display = "block";			
				footer_holder.style.height = footer.offsetHeight+10+'px'; 
				footer_holder.style.backgroundColor = 'transparent';
				moreChecked_flag=false;
			}else{
				for(i=0;i<moreChecked.length;i++){
					moreChecked[i].style.display='none';
				}
				finished.innerText = '编辑';
				footer.style.display = "none";			
				moreChecked_flag=true;
			}
		}
		var allChecked_flag = true;
		function allcheck_btn(){
			var btn=document.getElementsByClassName('radioList');
			if(allChecked_flag){
				allCheckBtn.setAttribute("checked","checked");
				for(j=0;j<btn.length;j++){
					btn[j].setAttribute("checked","checked");
				}
				allChecked_flag = !allChecked_flag;
				console.log(allChecked_flag)
			}else if(!allChecked_flag){
				allCheckBtn.removeAttribute("checked");
				for(j=0;j<btn.length;j++){
					btn[j].removeAttribute("checked");
				}
				allChecked_flag = !allChecked_flag;
				console.log(allChecked_flag)
			}
		}
		
		var dialog = new auiDialog({})
	    function openDialog(type){
            dialog.alert({
//              title:"弹出提示",
                msg:'是否确定全部删除?',
                buttons:['取消','确定']
            },function(ret){
            	if(ret.buttonIndex==2){
		          	var list = document.getElementsByClassName('aui-list-item');
					for(i=0;i<=list.length;i++){
						list[i].remove();
						console.log( i )
					}
            	}else if(ret.buttonIndex==1){
            		console.log(ret.buttonIndex)
            	}
            })
        }
	</script>
</html>